<template>
  <el-card class="divHead">
    <el-row>
      <el-col :span="19">
        <el-row>
          <el-col
            v-for="(item, index) in fromList"
            :key="index"
            :span="7"
            style="padding-left: 15px; padding-right: 15px"
          >
            <div class="divLable">{{ item.label }}</div>
            <!-- 输入框 -->
            <el-input
              v-if="item.type === 'input'"
              v-model="formData[item.prop]"
              placeholder="请输入"
            />
            <!-- 下拉框 -->
            <el-select
              v-if="item.type === 'select'"
              v-model="formData[item.prop]"
              placeholder="请输入"
            >
              <el-option
                v-for="option in item.options"
                :key="option.value"
                :label="option.label"
                :value="option.value"
              />
            </el-select>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="5">
        <div class="divButtom">
          <el-button type="primary" round @click="searchForm">搜索</el-button>
          <el-button type="info" plain round @click="resetForm">重置</el-button>
        </div>
      </el-col>
    </el-row>
  </el-card>
</template>

<script>
export default {
  props: {
    fromList: {
      type: Array,
      default: () => {}
    },
    formData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      input: ''
    }
  },
  methods: {
    resetForm() {
      this.$emit('resetForm')
    },
    searchForm() {
      this.$emit('searchForm', this.formData)
    }
  }
}
</script>

<style></style>
